<template>
	<view >
		<e-popup  :show="show" @close="$emit('close')" round="20rpx">
			<view class="nearby-store-cart">
				<view class="e-p-t-30 e-p-b-30 e-flex e-flex-between">
					<text class="fw-600 c-34">{{ $t('nearby.已选商品') }}</text>
					<view class="e-flex" @tap="modalShow = true">
						<image :src="$staticPath('classify/delete.png')" class="img-32 e-m-r-10"></image>
						<text class="c-secondary e-font-24">{{ $t('nearby.清空已选商品') }}</text>
					</view>
				</view>
				<view class="nearby-store-cart__list">
					<GoodsItme :goodsKeys="goodsKeys" :info="item" imgSize="120rpx" textBoxSize="134rpx" iconSize="46" line="1" v-for="(item, index) in list" :key="item.skuKey"   @numChange="numChange" @del="$emit('delGoods',item,index)"></GoodsItme>
				</view>
			</view>
		</e-popup>
		<view class="nearby-store__modal">
			<e-modal
				:show="modalShow"
				:showCancelButton="true"
				:confirmColor="primary"
				:title="$t('common.提示')"
				:confirmText="$t('common.确定')"
				:cancelText="$t('common.取消')"
				@cancel="modalShow = false"
				@confirm="del"
			>
				<view class="text-center e-font-32">
					{{ $t('nearby.清空商品') }}
				</view>
			</e-modal>
		</view>
	</view>
</template>

<script>
	import GoodsItme from './goods-item.vue'
	export default {
		// #ifdef MP-WEIXIN
		// 将自定义节点设置成虚拟的，更加接近Vue组件的表现
		options: {
			virtualHost: true
		},
		// #endif
		props:{
			goodsKeys:Object,
			list:Array,
			primary:String,
			show:Boolean
		},
		data () {
			return {
				modalShow:false,
				
			}
		},
		components:{
			GoodsItme
		},
		methods:{
			numChange(number,goods) {
				this.$emit('goodsNumChange',goods,number)
			},
			del () {
				this.$emit('del')
				this.modalShow = false
			}
		}
	}
</script>

<style lang="scss" scoped>
	.nearby-store-cart {
		padding: 0 20rpx 100rpx 20rpx;
		&__list {
			min-height: 200rpx;
			max-height: 1180rpx;
			white-space: nowrap;
			overflow-y: auto;
		}
	}
	.nearby-store__modal{
		:deep(.e-transition){
			z-index: 10076 !important;
		}
	}
</style>